<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>bui.tab</title>
    <!-- <link rel="stylesheet" href="http://yui.yahooapis.com/3.9.1/build/cssgrids/cssgrids-min.css"> -->
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="../assets/css/cssgrids-min.css">
    <link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css">
    <link rel="stylesheet" href="../assets/css/main.css" id="site_styles">
    <link rel="shortcut icon" type="image/png" href="../assets/favicon.png">
    <!-- <script src="http://yui.yahooapis.com/combo?3.9.1/build/yui/yui-min.js"></script> -->
    <script src="../assets/js/jquery-1.9.1.min.js"></script>
    <script src="../assets/js/index.js"></script>
    <script src="../assets/js/yui-min.js"></script>
    <script src="../assets/js/combo/oop-min.js"></script>
    <script src="../assets/js/combo/array-extras-min.js"></script>
    <script src="../assets/js/combo/autocomplete.js"></script>
    <script src="../assets/js/combo/history-base-min.js"></script>
</head>
<body class="yui3-skin-sam">
<div id="sidemenu" class="sidebar-menu">菜单</div>
<div id="doc">
    <div id="hd" class="yui3-g header">
        <div class="yui3-u-3-4">
            
                <h1><a href="../index.html"><img src="../assets/css/logo.png" title="" width="30px"></a>
                <a href="../index.html">BUI</a>
                
                </h1>
            
            <p class="off-left">其它版本:<select name="" id="" onchange="window.location.href=this.value"><option value="../api/index.html" selected>1.5.0</option><option value="../api-1.4.8/index.html">1.4.8</option></select></p>
            <p class="off-left" style="font-size:12px;margin-right: 15px;">API for BUI 1.5.4 </p>
            
        </div>
    </div>
    <div id="bd" class="yui3-g">

        <div id="sidebar" class="yui3-u-1-4">
            <div id="docs-sidebar" class="sidebar apidocs">
                <div id="api-list">
    <div id="api-tabview" class="tabview">

        <ul class="tabs">
            <li><a href="#api-classes">Classes</a></li>
            <li><a href="#api-modules">Modules</a></li>
        </ul>

        <div id="api-tabview-filter">
            <input type="search" id="api-filter" placeholder="Type to filter APIs">
        </div>

        <div id="api-tabview-panel">
            <ul id="api-classes" class="apis classes">
            
                <li><a href="../classes/bui.accordion.html">bui.accordion</a></li>
            
                <li><a href="../classes/bui.actionsheet.html">bui.actionsheet</a></li>
            
                <li><a href="../classes/bui.ajax.html">bui.ajax</a></li>
            
                <li><a href="../classes/bui.alert.html">bui.alert</a></li>
            
                <li><a href="../classes/bui.all.html">bui.all</a></li>
            
                <li><a href="../classes/bui.animate.html">bui.animate</a></li>
            
                <li><a href="../classes/bui.array.html">bui.array</a></li>
            
                <li><a href="../classes/bui.back.html">bui.back</a></li>
            
                <li><a href="../classes/bui.btn.html">bui.btn</a></li>
            
                <li><a href="../classes/bui.config.html">bui.config</a></li>
            
                <li><a href="../classes/bui.confirm.html">bui.confirm</a></li>
            
                <li><a href="../classes/bui.delete.html">bui.delete</a></li>
            
                <li><a href="../classes/bui.dialog.html">bui.dialog</a></li>
            
                <li><a href="../classes/bui.download.html">bui.download</a></li>
            
                <li><a href="../classes/bui.dropdown.html">bui.dropdown</a></li>
            
                <li><a href="../classes/bui.emitter.html">bui.emitter</a></li>
            
                <li><a href="../classes/bui.file.html">bui.file</a></li>
            
                <li><a href="../classes/bui.fileselect.html">bui.fileselect</a></li>
            
                <li><a href="../classes/bui.get.html">bui.get</a></li>
            
                <li><a href="../classes/bui.getPageParams.html">bui.getPageParams</a></li>
            
                <li><a href="../classes/bui.guid.html">bui.guid</a></li>
            
                <li><a href="../classes/bui.hint.html">bui.hint</a></li>
            
                <li><a href="../classes/bui.init.html">bui.init</a></li>
            
                <li><a href="../classes/bui.input.html">bui.input</a></li>
            
                <li><a href="../classes/bui.levelselect.html">bui.levelselect</a></li>
            
                <li><a href="../classes/bui.list.html">bui.list</a></li>
            
                <li><a href="../classes/bui.listview.html">bui.listview</a></li>
            
                <li><a href="../classes/bui.load.html">bui.load</a></li>
            
                <li><a href="../classes/bui.loader.html">bui.loader</a></li>
            
                <li><a href="../classes/bui.loading.html">bui.loading</a></li>
            
                <li><a href="../classes/bui.mask.html">bui.mask</a></li>
            
                <li><a href="../classes/bui.number.html">bui.number</a></li>
            
                <li><a href="../classes/bui.pickerdate.html">bui.pickerdate</a></li>
            
                <li><a href="../classes/bui.platform.html">bui.platform</a></li>
            
                <li><a href="../classes/bui.post.html">bui.post</a></li>
            
                <li><a href="../classes/bui.prompt.html">bui.prompt</a></li>
            
                <li><a href="../classes/bui.pullrefresh.html">bui.pullrefresh</a></li>
            
                <li><a href="../classes/bui.put.html">bui.put</a></li>
            
                <li><a href="../classes/bui.rating.html">bui.rating</a></li>
            
                <li><a href="../classes/bui.ready.html">bui.ready</a></li>
            
                <li><a href="../classes/bui.refresh.html">bui.refresh</a></li>
            
                <li><a href="../classes/bui.router.html">bui.router</a></li>
            
                <li><a href="../classes/bui.run.html">bui.run</a></li>
            
                <li><a href="../classes/bui.scroll.html">bui.scroll</a></li>
            
                <li><a href="../classes/bui.searchbar.html">bui.searchbar</a></li>
            
                <li><a href="../classes/bui.select.html">bui.select</a></li>
            
                <li><a href="../classes/bui.sidebar.html">bui.sidebar</a></li>
            
                <li><a href="../classes/bui.slide.html">bui.slide</a></li>
            
                <li><a href="../classes/bui.stepbar.html">bui.stepbar</a></li>
            
                <li><a href="../classes/bui.storage.html">bui.storage</a></li>
            
                <li><a href="../classes/bui.store.html">bui.store</a></li>
            
                <li><a href="../classes/bui.swipe.html">bui.swipe</a></li>
            
                <li><a href="../classes/bui.tab.html">bui.tab</a></li>
            
                <li><a href="../classes/bui.typeof.html">bui.typeof</a></li>
            
                <li><a href="../classes/bui.unit.html">bui.unit</a></li>
            
                <li><a href="../classes/bui.upload.html">bui.upload</a></li>
            
                <li><a href="../classes/bui.viewport.html">bui.viewport</a></li>
            
            </ul>

            <ul id="api-modules" class="apis modules">
            
                <li><a href="../modules/Animate.html">Animate</a></li>
            
                <li><a href="../modules/Core.html">Core</a></li>
            
                <li><a href="../modules/Event.html">Event</a></li>
            
                <li><a href="../modules/Method.html">Method</a></li>
            
                <li><a href="../modules/Native.html">Native</a></li>
            
                <li><a href="../modules/UI.html">UI</a></li>
            
            </ul>
        </div>
    </div>
</div>
 
            </div>
        </div>
        <div class="yui3-u-3-4">
                <div id="api-options">
        Show:
        <label for="api-show-inherited">
            <input type="checkbox" id="api-show-inherited" checked>
            Inherited
        </label>

        <label for="api-show-protected">
            <input type="checkbox" id="api-show-protected">
            Protected
        </label>

        <label for="api-show-private">
            <input type="checkbox" id="api-show-private">
            Private
        </label>
        <label for="api-show-deprecated">
            <input type="checkbox" id="api-show-deprecated">
            Deprecated
        </label>

    </div>


            <div class="apidocs">
                <div id="docs-main">
                    <div class="content">
                        <h1>bui.tab Class</h1>
<div class="box meta">
    

    
        <div class="extends">
            Extends <a href="../classes/bui.slide.html" class="crosslink">bui.slide</a>
        </div>
    

    
        <div class="foundat">
            Defined in: <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.tab.js.html#l8"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.tab.js:8</code></a>
        </div>
    

    
        
            Module: <a href="../modules/UI.html">UI</a>
        
    

    
        <p>Available since 1.5.0</p>
    
</div>



<div class="box intro">
    <div class="oui-fluid">
  <div class="span8">
    <h2>Tab控件</h2>
    <p>Tab控件基于bui.slide制作,tab的方法及事件请参考 bui.slide </p>
    <h3>预览地址: <a href="../../index.html#pages/ui_controls/bui.tab.html" target="_blank">demo</a></h3>
  </div>
  <div class="span4"><a href="../../index.html#pages/ui_controls/bui.tab.html" target="_blank"><img src="http://www.easybui.com/static/images/controls/bui-tab_low.gif" alt="控件预览"/></a></div>
</div>
</div>


    <div class="constructor">
        <h2>Constructor</h2>
        <div id="method_bui.tab" class="method item">
    <h3 class="name"><code>bui.tab</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>option</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.tab.js.html#l8"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.tab.js:8</code></a>
        
        </p>


        

        
            <p>Available since 1.5.0</p>
        
    </div>

    <div class="description">
        
    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">option</code>
                        <span class="type">Object</span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                        <ul class="params-list">
                            
                            <li class="param">
                                
                                    <code class="param-name">id</code>
                                    <span class="type">String</span>
                                

                                <div class="param-description">
                                    <p>[控件id]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[menu]</code>
                                    <span class="type">String</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 默认&quot;.bui-tab-head ul&quot; (循环元素的父级), 如果控制菜单要独立,可以使用id选择器]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[children]</code>
                                    <span class="type">String</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 默认&quot;.bui-tab-main ul&quot; (循环元素的父级), 如果控制内容要独立,可以使用id选择器, tab嵌套必须使用id ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[stopHandle]</code>
                                    <span class="type">String</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 1.4.2新增,样式名,默认为空,支持多个样式名,以逗号间隔. 当这个值等于tab里面的某个样式,不触发滑动,一般用于事件冲突,比方 input[type=range] 无法滑动的时候 ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[width]</code>
                                    <span class="type">Number</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[0 为默认屏幕宽度]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[height]</code>
                                    <span class="type">Number</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[0 为默认屏幕高度,会计算剩余的高度]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[index]</code>
                                    <span class="type">Number</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 默认:0 ,第一次加载第几个 ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[direction]</code>
                                    <span class="type">String</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 水平滑动还是纵向滑动 默认: x | y ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[alignClassName]</code>
                                    <span class="type">String</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ since 1.3.4 默认是&quot;&quot;,全屏默认是:&quot;bui-box-center&quot;, 每个li的盒子对齐样式名,主要用于全屏时的内容对齐,自带几种对齐方式 左:bui-box-align-left 水平中:bui-box-align-right 右:bui-box-align-center 上:bui-box-align-top 垂直中:bui-box-align-middle 下:bui-box-align-bottom  ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[swipe]</code>
                                    <span class="type">Boolean</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 是否允许侧滑,默认允许 true | false ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[animate]</code>
                                    <span class="type">Boolean</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 点击菜单跳转到某个位置是否采用动画 默认: true | false ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[scroll]</code>
                                    <span class="type">Boolean</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 是否允许垂直滚动 false | true , 如果单独需要滚动 可以给滑动的li的属性加上 data-scroll=true ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[autoheight]</code>
                                    <span class="type">Boolean</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 1.4.3新增, 自动高度,由内容撑开 默认:false | true ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[visibleNum]</code>
                                    <span class="type">Number</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 1.4.5新增, 可视个数,默认为1 ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[scrollNum]</code>
                                    <span class="type">Number</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 1.4.5新增, 一次滚动个数,默认为1 ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[distance]</code>
                                    <span class="type">Number</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 默认40, 拖拽大于distance才会生效,配合delay可以防止tab又有上下其它事件 ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[callback]</code>
                                    <span class="type">Function</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 点击的回调 1.3.0 以后不再推荐,自行绑定就可 ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[autoload]</code>
                                    <span class="type">Boolean</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 1.4新增 默认: false | true 远程加载菜单按钮上的 href 地址, 如果点击的按钮有disabled属性或者样式,则不跳转]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[onBeforeTo]</code>
                                    <span class="type">Function</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 1.5.4新增 跳转前触发, return fasle 则不能跳转过去; 可以拿到 跳转的目标索引 e.currentIndex, 以及当前索引 e.prevIndex  ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[onBeforeInit]</code>
                                    <span class="type">Function</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 1.5.1新增 初始化前触发 ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[onInited]</code>
                                    <span class="type">Function</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 1.5.1新增 初始化以后触发 ]</p>

                                </div>

                                
                            </li>
                            
                        </ul>
                    
                </li>
            
            </ul>
        </div>
    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <p>  // 示例1: 静态结构初始化, 固定结构, li里面的内容自定义
  html:</p>
<pre class="code prettyprint"><code>          &lt;div id=&quot;uiTab&quot; class=&quot;bui-tab&quot;&gt;
            &lt;!-- 菜单结构 --&gt;
            &lt;div class=&quot;bui-tab-head&quot;&gt;
              &lt;ul&gt;
                &lt;li&gt;Tab1&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/div&gt;
            &lt;!-- 内容结构 --&gt;
            &lt;div class=&quot;bui-tab-main&quot;&gt;
              &lt;ul&gt;
                &lt;li&gt;
                  &lt;!-- 从这里开始,可以自定义 start --&gt;
                  &lt;img src=&quot;../images/slideshow.png&quot; alt=&quot;&quot;&gt;
                  &lt;!-- 从这里开始,可以自定义 end --&gt;
                &lt;/li&gt;
                &lt;li style=&quot;display:none&quot;&gt;
                  &lt;!-- 第2个内容, 先设置样式不可见,避免渲染闪跳 --&gt;
                  &lt;img src=&quot;../images/slideshow2.png&quot; alt=&quot;&quot;&gt;
                &lt;/li&gt;
              &lt;/ul&gt;
            &lt;/div&gt;
          &lt;/div&gt;</code></pre>
<p>  js:</p>
<pre class="code prettyprint"><code>          // 初始化
          var uitab = bui.tab({
                    id:&quot;#uiTab&quot;
                  })

      // 示例2: 1.5.2 新增动态渲染:
      html:

      &lt;div id=&quot;uiTab&quot; class=&quot;bui-tab&quot;&gt;&lt;/div&gt;

      js:
      // 先初始化
      var uiTab = bui.tab({
            id:&quot;#uiTab&quot;,
            template: function (data) {
              var html =&quot;&quot;;
              // 渲染菜单结构
              html +=<code>&amp;lt;div class=&amp;quot;bui-tab-head&amp;quot;&amp;gt;&amp;lt;ul id=&amp;quot;nav&amp;quot; class=&amp;quot;bui-nav&amp;quot;&amp;gt;</code>
                 data.forEach(function (item,i) {
                   html +=<code>&amp;lt;li class=&amp;quot;bui-btn&amp;quot;&amp;gt;${item.title}&amp;lt;&#x2F;li&amp;gt;</code>
                 })
                      html +=<code>&amp;lt;&#x2F;ul&amp;gt;&amp;lt;&#x2F;div&amp;gt;</code>
              // 渲染内容结构
              html +=<code>&amp;lt;div class=&amp;quot;bui-tab-main&amp;quot;&amp;gt;&amp;lt;ul&amp;gt;</code>
                data.forEach(function (item,i) {
                  html +=<code>&amp;lt;li&amp;gt;&amp;lt;img src=&amp;quot;${item.image}&amp;quot; alt=&amp;quot;&amp;quot;&amp;gt;&amp;lt;&#x2F;li&amp;gt;</code>
                })
              html +=<code>&amp;lt;&#x2F;ul&amp;gt;&amp;lt;&#x2F;div&amp;gt;</code>
              return html;
            }
        });

      // 请求成功以后修改值
       bui.ajax({
           url: &quot;http://www.easybui.com/demo/json/shop.json&quot;,
           data: {},//接口请求的参数
           // 可选参数
           method: &quot;GET&quot;
       }).then(function(result){
         // 模拟数据
          var data = [{
            image: &quot;images/banner01.png&quot;
          }]
           // 修改动态值
           uitab.option(&quot;data&quot;,data)
       });

       // 示例2: 1.5.4 支持跳转前拦截:
      html:

      &lt;div id=&quot;uiTab&quot; class=&quot;bui-tab&quot;&gt;&lt;/div&gt;

      js:
      // 示例未登录状态
      var hasLogin = false;
      // 初始化
      var uiTab = bui.tab({
            id:&quot;#uiTab&quot;,
            onBeforeTo: function(e) {
              // 跳转的目标索引
               console.log(&quot;currentIndex&quot;, e.currentIndex)
              // 跳转前的索引
               console.log(&quot;prevIndex&quot;, e.prevIndex)
               // 跳转到索引为1的时候,如果登录状态没有,则进行拦截
               // if (e.currentIndex == 1 &amp;&amp; !hasLogin ) {
               //     bui.alert(&quot;您还没有登录呢&quot;)
               //     return false;
               // }
           }
        });</code></pre>

            </div>
        </div>
    
</div>

    </div>


<div id="classdocs" class="tabview">
    <ul class="api-class-tabs">
        <li class="api-class-tab index"><a href="#index">Index</a></li>

        
            <li class="api-class-tab methods"><a href="#methods">Methods</a></li>
        
        
        
        
            <li class="api-class-tab events"><a href="#events">Events</a></li>
        
    </ul>

    <div>
        <div id="index" class="api-class-tabpanel index">
            <h2 class="off-left">Item Index</h2>

            
                <div class="index-section methods">
                    <h3>Methods</h3>

                    <ul class="index-list methods extends">
                        
                            <li class="index-item method inherited">
                                <a href="#method_destroy">destroy</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_getPages">getPages</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_index">index</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_init">init</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_load">load</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_lock">lock</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_next">next</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_option">option</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_prev">prev</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_resize">resize</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_start">start</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_stop">stop</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_to">to</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_unlock">unlock</a>

                                
                                
                            </li>
                        
                            <li class="index-item method inherited">
                                <a href="#method_widget">widget</a>

                                
                                
                            </li>
                        
                    </ul>
                </div>
            

            

            

            
                <div class="index-section events">
                    <h3>Events</h3>

                    <ul class="index-list events extends">
                        
                            <li class="index-item event inherited">
                                <a href="#event_off">off</a>

                                
                                
                            </li>
                        
                            <li class="index-item event inherited">
                                <a href="#event_on">on</a>

                                
                                
                            </li>
                        
                    </ul>
                </div>
            
        </div>

        
            <div id="methods" class="api-class-tabpanel">
                <h2 class="off-left">Methods</h2>

                
                    <div id="method_destroy" class="method item inherited">
    <h3 class="name"><code>destroy</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code class="optional">[bool]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    

    

    

    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_destroy">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1696"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1696</code></a>
        
        </p>


        

        
            <p>Available since 1.4.2</p>
        
    </div>

    <div class="description">
        <p>[销毁控件]</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name optional">[bool]</code>
                        <span class="type">Boolean</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[ 默认: false 销毁部分 | true 销毁全部   ]</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       //销毁
       uiSlide.destroy();</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_getPages" class="method item inherited">
    <h3 class="name"><code>getPages</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type">Number</span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_getPages">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l705"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:705</code></a>
        
        </p>


        

        
            <p>Available since 1.5.2</p>
        
    </div>

    <div class="description">
        <p>获取有多少个子元素</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type">Number</span>:
                    
                    <p>[返回多少个]</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_index" class="method item inherited">
    <h3 class="name"><code>index</code></h3>

    
        <span class="paren">()</span>
    

    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_index">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1278"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1278</code></a>
        
        </p>


        

        
            <p>Available since 1.3.0</p>
        
    </div>

    <div class="description">
        <p>当前索引</p>

    </div>

    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       var index = uiSlide.index();</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_init" class="method item inherited">
    <h3 class="name"><code>init</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code class="optional">[option]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_init">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l315"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:315</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>初始化方法,用于重新初始化结构,事件只初始化一次</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name optional">[option]</code>
                        <span class="type">Object</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[参数控件本身]</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
</div>

                
                    <div id="method_load" class="method item inherited">
    <h3 class="name"><code>load</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code class="optional">[option]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    

    

    

    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_load">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1499"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1499</code></a>
        
        </p>


        

        
            <p>Available since 1.4.0</p>
        
    </div>

    <div class="description">
        <div class="oui-fluid">
  <div class="span12">
    <h2>动态加载页面,模拟路由</h2>
    <p>由于多页开发,后退不能刷新页面,所以便有这个slide来模拟简单的路由加载, 用于跟多页配合</p>
    <h3>预览地址: <a href="../../index.html#pages/ui_controls/bui.slide_tab_router.html" target="_blank">demo</a></h3>
  </div>
</div>
    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name optional">[option]</code>
                        <span class="type">Object</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[ 页面跳转的地址  ]</p>

                    </div>

                    
                        <ul class="params-list">
                            
                            <li class="param">
                                
                                    <code class="param-name">url</code>
                                    <span class="type">String</span>
                                

                                <div class="param-description">
                                    <p>[ 页面跳转的地址  ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[id]</code>
                                    <span class="type">Object</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 页面结果加载到的地方,可选,默认是下一个  ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[preload]</code>
                                    <span class="type">Boolean</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 预加载,默认: false 自动跳转到加载的页面 | true, 则不跳转  ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[success]</code>
                                    <span class="type">Function</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 成功回调  ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[fail]</code>
                                    <span class="type">Function</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 失败回调  ]</p>

                                </div>

                                
                            </li>
                            
                        </ul>
                    
                </li>
            
            </ul>
        </div>
    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       uiTab.load({
         url: &quot;bui.slide_tab_router_page1.html&quot;
       })</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_lock" class="method item inherited">
    <h3 class="name"><code>lock</code></h3>

    
        <span class="paren">()</span>
    

    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_lock">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1347"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1347</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>不允许拖拽</p>

    </div>

    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>      uiSlide.lock();</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_next" class="method item inherited">
    <h3 class="name"><code>next</code></h3>

    
        <span class="paren">()</span>
    

    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_next">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1314"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1314</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>下一个</p>

    </div>

    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       uiSlide.next();</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_option" class="method item inherited">
    <h3 class="name"><code>option</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code class="optional">[key]</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[value]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_option">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1743"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1743</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>获取设置参数</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name optional">[key]</code>
                        <span class="type">String | object</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[ 不传则获取所有参数, 类型为string,没有第2个参数则获取某个参数 ]</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[value]</code>
                        <span class="type">String | number | boolean | function</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[ 设置参数的时候要传,设置多个参数不用传,获取参数的时候也不用传 ]</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       //获取所有参数
        //获取所有参数
       var option = uiSlide.option();

       //获取某个参数
       var id = uiSlide.option( &quot;id&quot; );

       //修改一个参数
       uiSlide.option( &quot;autoplay&quot;,false );

       //修改多个参数
       uiSlide.option( {&quot;autoplay&quot;:false} );</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_prev" class="method item inherited">
    <h3 class="name"><code>prev</code></h3>

    
        <span class="paren">()</span>
    

    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_prev">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1292"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1292</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>上一个</p>

    </div>

    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       uiSlide.prev();</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_resize" class="method item inherited">
    <h3 class="name"><code>resize</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code class="optional">[option]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_resize">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1671"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1671</code></a>
        
        </p>


        

        
            <p>Available since 1.5.3</p>
        
    </div>

    <div class="description">
        <p>重新计算宽高</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name optional">[option]</code>
                        <span class="type">Object</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[ 可以不传 ]</p>

                    </div>

                    
                        <ul class="params-list">
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[width]</code>
                                    <span class="type">Number</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 如果不传则自动计算 ]</p>

                                </div>

                                
                            </li>
                            
                            <li class="param">
                                
                                    <code class="param-name optional">[height]</code>
                                    <span class="type">Number</span>
                                    <span class="flag optional" title="This parameter is optional.">optional</span>
                                

                                <div class="param-description">
                                    <p>[ 如果不传则自动计算,一些特殊情况需要告诉它在哪个高度下自动计算 ]</p>

                                </div>

                                
                            </li>
                            
                        </ul>
                    
                </li>
            
            </ul>
        </div>
    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       //重新计算高度
       uiSlide.resize();</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_start" class="method item inherited">
    <h3 class="name"><code>start</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>time</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_start">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1263"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1263</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>自动播放</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">time</code>
                        <span class="type">Number</span>
                    

                    

                    <div class="param-description">
                        <p>[重新设置循环时间]</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       //自动播放
       uiSlide.start();</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_stop" class="method item inherited">
    <h3 class="name"><code>stop</code></h3>

    
        <span class="paren">()</span>
    

    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_stop">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1235"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1235</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>停止自动播放</p>

    </div>

    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>      //自动播放
      uiSlide.stop();</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_to" class="method item inherited">
    <h3 class="name"><code>to</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>index</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[transition]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_to">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1124"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1124</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>跳到第几个</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">index</code>
                        <span class="type">Number</span>
                    

                    

                    <div class="param-description">
                        <p>[索引,从0开始]</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[transition]</code>
                        <span class="type">String</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[  &quot;all 300ms&quot;(不传则默认) | &quot;none&quot;(不要动画) | &quot;all 300ms ease-out&quot; (可以加上缓冲效果) ]</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       //跳到第2个
       uiSlide.to(1);</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_unlock" class="method item inherited">
    <h3 class="name"><code>unlock</code></h3>

    
        <span class="paren">()</span>
    

    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_unlock">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1372"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1372</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>允许拖拽</p>

    </div>

    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       uiSlide.unlock();</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="method_widget" class="method item inherited">
    <h3 class="name"><code>widget</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code class="optional">[name]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    

    

    

    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#method_widget">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1728"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1728</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>获取依赖的控件</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name optional">[name]</code>
                        <span class="type">String</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[ 依赖控件名 ]</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       //获取依赖控件
       var uiSlideWidget = uiSlide.widget();</code></pre>

            </div>
        </div>
    
</div>

                
            </div>
        

        

        

        
            <div id="events" class="api-class-tabpanel">
                <h2 class="off-left">Events</h2>

                
                    <div id="event_off" class="events item inherited">
    <h3 class="name"><code>off</code></h3>
    <span class="type"></span>

    

    

    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#event_off">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1791"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1791</code></a>
        
        </p>

        

        
            <p>Available since 1.3.0</p>
        
    </div>

    <div class="description">
        <p>为控件取消绑定事件</p>

    </div>

    
        <div class="params">
            <h4>Event Payload:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name optional">[type]</code>
                        <span class="type">String</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[ 事件类型: &quot;play&quot;(播放的时候触发) |&quot;stop&quot;(停止的时候触发) |&quot;first&quot;(在第一个往左边操作的时候触发) | &quot;last&quot;(在最后一个往右边操作的时候触发) | &quot;to&quot;(每次跳转时触发,除了第1次不触发) | &quot;afterto&quot;(每次跳转后触发) | &quot;load&quot;(自动加载远程页面 1.4)  ]</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[callback]</code>
                        <span class="type">Function</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[ 绑定的事件, this 为当前点击的菜单 ]</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    


    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       uiSlide.off(&quot;lock&quot;);</code></pre>

            </div>
        </div>
    
</div>

                
                    <div id="event_on" class="events item inherited">
    <h3 class="name"><code>on</code></h3>
    <span class="type"></span>

    

    

    

    

    <div class="meta">
        
            
                <p>Inherited from
                <a href="../classes/bui.slide.html#event_on">bui.slide</a>:
            
        
        
        <a href="../files/_Users_wilson_personal_htdocs_opensource_bui-rollup_src_scripts_ui_bui.slide.js.html#l1771"><code>&#x2F;Users&#x2F;wilson&#x2F;personal&#x2F;htdocs&#x2F;opensource&#x2F;bui-rollup&#x2F;src&#x2F;scripts&#x2F;ui&#x2F;bui.slide.js:1771</code></a>
        
        </p>

        

        
            <p>Available since 1.3.0</p>
        
    </div>

    <div class="description">
        <p>为控件绑定事件</p>

    </div>

    
        <div class="params">
            <h4>Event Payload:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name optional">[type]</code>
                        <span class="type">String</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[ 事件类型: &quot;play&quot;(播放的时候触发) |&quot;stop&quot;(停止的时候触发) |&quot;first&quot;(在第一个往左边操作的时候触发) | &quot;last&quot;(在最后一个往右边操作的时候触发) | &quot;to&quot;(每次跳转时触发,除了第1次不触发) | &quot;afterto&quot;(每次跳转后触发) | &quot;load&quot;(自动加载远程页面  1.4) ]</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[callback]</code>
                        <span class="type">Function</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>[ 绑定的事件, this 为当前点击的菜单 ]</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    


    
        <div class="example">
            <h4>Example:</h4>

            <div class="example-content">
                <pre class="code prettyprint"><code>       uiSlide.on(&quot;lock&quot;,function () {
           // 点击的菜单
           console.log(this);
       });</code></pre>

            </div>
        </div>
    
</div>

                
            </div>
        
    </div>
</div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="../assets/vendor/prettify/prettify-min.js"></script>
<script>prettyPrint();</script>
<script src="../assets/js/yui-prettify.js"></script>
<script src="../assets/../api.js"></script>
<script src="../assets/js/api-filter.js"></script>
<script src="../assets/js/api-list.js"></script>
<script src="../assets/js/api-search.js"></script>
<script src="../assets/js/apidocs.js"></script>
<!-- 百度统计 -->
<script>
var _hmt = _hmt || [];
    (function() {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?1e19beda5d47048a31939f0f67d9b1f9";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
    })();
</script>


</body>
</html>
